/*
主要的 Portal 入口组件，提供静态方法和上下文消费,用于在组件树之外渲染内容
作用：
  提供 Portal.Host 静态属性指向 PortalHost 组件
  提供 Portal.add() 和 Portal.remove() 静态方法用于全局操作

工作流程
    用户使用 Portal 组件包裹内容

    Portal 通过上下文获取 manager

    PortalConsumer 通过 manager 注册/更新/移除内容

    PortalHost 接收操作并转发给 PortalManager

    PortalManager 实际渲染所有 Portal 内容

使用场景
  模态框（Modal）

  提示框（Toast）

  弹出菜单（Popover）

  任何需要突破组件层级限制的悬浮内容

*/
import React from 'react'
import PortalConsumer from './PortalConsumer'
import PortalHost, {portal, PortalContext} from './PortalHost'

export type PortalProps = {
  children?: React.ReactNode
}

class Portal extends React.Component<PortalProps> {
  static Host = PortalHost

  static add = portal.add

  static remove = portal.remove

  render() {
    const {children} = this.props

    return <PortalContext.Consumer>{manager => <PortalConsumer manager={manager}>{children}</PortalConsumer>}</PortalContext.Consumer>
  }
}

export default Portal
